<template>
    <div class="detail-wrapper">
      <div class="content-wrapper">
        <div class="title-wrapper">
          <p>你好新朋友</p>
          <p class="time">2018-02-21 19:26:10</p>
        </div>
        <div class="content">
          <p>山不在高，有仙则名。水不在深，有龙则灵。斯是陋室，惟吾德馨。苔痕上阶绿，草色入帘青。谈笑有鸿儒，往来无白丁。可以调素琴，阅金经。无丝竹之乱耳，无案牍之劳形。南阳诸葛庐，西蜀子云亭。孔子云：何陋之有？</p>
        </div>
      </div>
    </div>
</template>

<script>
    export default {
        name: "detail"
    }
</script>

<style scoped rel="stylesheet/scss" lang="scss">
  .detail-wrapper{
    min-height: calc(100vh - 84px);
    background: #f0f2f5;
    padding:20px;
    .content-wrapper{
      background: #fff;
      border-radius: 5px;
      .title-wrapper {
        padding: 10px 20px;
        border-bottom: 1px solid #eeeeee;
        p {
          margin: 10px 0px;
        }
        .time {
          color: #888;
          font-size: 13px;
        }
      }
      .content{
        padding:10px 20px;
        p{
          line-height: 150%;
          font-size: 14px;
          color: #333;
          text-indent:2em
        }
      }
    }
  }
</style>
